<!DOCTYPE html>
<!--
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
-->
<html>
    <head>
        <title>CORSARIO</title>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <script type="text/javascript">
   function iniciando() {
            var fondo = new Image();
            var canvas = null;
            var context = null;
            var wsUri = "ws://localhost:8080/Corsario999/endpoint";
            var websocket = new WebSocket(wsUri);
            var json2 = ({});
          
            canvas = document.getElementById('agua2');
            context = canvas.getContext('2d');
            if (canvas !== null)
            {
                
                fondo.src = 'resource/ScenarioAgua.png';
                fondo.onload=function() {
                context.drawImage(fondo,0,0)
                     context.fillStyle="#fff";
                    context.fillText("Seleccione punto de partida",10,450);
                context.save();
                }
                canvas.addEventListener("mousedown",doMouseDown,false);
                function doMouseDown(event) {
                    json2 = JSON.stringify({
                    "partidabarcox" : event.pageX,"partidabarcoy" : event.pageY});
                //no hace el onopen y envio
                 websocket.onopen = function (event) {
                          websocket.send(json2);
                  };
                 }
                
                
            }    
    }        
            
        </script>
    </head>
    <body onload="iniciando();">
    <canvas id="agua2" width="1200" height=600"></canvas>
    </body>
</html>
